<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
  <meta charset="utf-8"></meta>
  <meta http-equiv="X-UA-Compatible" content="IE=edge"></meta>
  <title></title>
</head>

<body class="hold-transition skin-blue sidebar-mini">
  <div th:fragment="humitureHistorySearch">

    <div class="historySearch">
      <!-- 历史搜索 -->
      <div class="modal fade hisSearchModalStyle" id="humitureHisSearchModal" >
        <div class="modal-dialog modal-lg  box box-primary" style="width:1200px">
        	
          <div class="modal-content">
	           <div class="modal-header"> 
	           			<button type="button" class="close" data-dismiss="modal" aria-label="Close">
                  <span aria-hidden="true">×</span></button>
	                     <h4 class="modal-title">设备历史查询</h4>
	            </div>  
              
            <div class="modal-body" style="padding-top:0;">
              <form action="#" class="searchForm" method="post">
                <div class="box-header with-border">
                  <div class="searchStartData form-group col-lg-3">
                    <label class="col-xs-3 control-label">起始日期</label>
                    <div class="col-xs-8 date starts" data-provide="datepicker">
                      <div class=" input-group">
                        <div class="input-group-addon">
                          <span class="fa fa-calendar"></span>
                        </div>
                        <input type="text" class="form-control pull-right" placeholder="请输入查询时间" value=" " readonly>
                      </div>
                    </div>
                  </div>
                  <div class="form-group col-lg-2 searchEndData mr20">
                    <label class="col-xs-1 control-label">至</label>
                    <div class="col-xs-10 date" data-provide="datepicker">
                      <div class=" input-group">
                        <div class="input-group-addon">
                          <span class="fa fa-calendar"></span>
                        </div>
                        <input type="text" class="form-control pull-right" placeholder="请输入查询时间" value=" " readonly>
                      </div>
                    </div>
                  </div>
                  <!-- 设备编号 -->
                  <div class="form-group col-lg-3 mr20">
                    <label class="col-xs-3 control-label">安装地址</label>
                    <div class="col-xs-8 humitureHisSearchDev">
                      <input type="text" class="form-control" th:attr="data-fv-regexp-message='设备编号不能为空'" data-fv-regexp="true" data-fv-regexp-regexp="^[0-9a-zA-Z\-\_]+$" />
                    </div>
                  </div>
                  <!-- 报警类型 -->
                  <div class="form-group has-feedback col-lg-2 humitureHisAlarmType mr20">
                    <label class="col-xs-4 control-label">报警类型</label>
                    <div class="col-xs-7">
                      <select class="form-control">
                      	<option>全部</option>
                        <option alarmType="061">温湿度报警</option>
                        <option alarmType="003">温湿度故障</option>
                      </select>
                    </div>
                  </div>
                  <ul class="humitureHisSearchList hisSearchList-style">
                    <!-- TODO -->
                  </ul>
                  <div class="form-group col-lg-1">
                    <div class="box-tools col-xs-2">
                      <button type="button" id="humitureHisSearchBtn" class="btn btn-primary btn-sm" data-toggle="modal">查询</button>
                    </div>
                  </div>
                </div>
              </form>
              <p class="resultSum"><i>查询结果：</i><span>0</span> 条记录</p>
              <div class="box-body no-padding humitureHisSearchTitle hisSearchTitleStyle">
                <table class="table table-striped table-bordered table-hover dataTable">
                  <thead>
                    <tr class="bg-light-blue disabled">

                      <th>
                        设备名称
                      </th>
                      <th>
                        设备地址
                      </th>
                      <th>
                        报警类型
                      </th>
                      <th>
                        发生时间
                      </th>
                      <th>
                        结束时间
                      </th>
                      <th>
                        处理方式
                      </th>
                      <th>
                        处理人
                      </th>
                      <th>
                        设备编码
                      </th>
                    </tr>
                  </thead>
                  <tbody>
					<!-- TODO -->
					
					<!-- loading -->
					<!-- <div class="overlay"><i class="fa fa-refresh fa-spin"></i></div> -->
					
                  </tbody>
                </table>
              </div>
            </div>
          </div>
        </div>
      </div>
      <script>
      //$("#box-widget").activateBox();
      //起始时间日历初始化
      $('.date').datepicker({
        language: "zh-CN",
        autoclose: true,
        startView: 0,
        format: "yyyy-mm-dd",
        clearBtn: false
        //todayBtn: true
      });
      $(function () {
          $(".humitureDeviceHistory").click(function () {
          	//
/*           		$.ajax({
                    url: "/alarm/data/history/list?beginTime=2017-1-1 00:00:00&endTime=2019-1-1 00:00:00&alarmTypeCode=62&deviceTypeId=007",
                    type: 'GET',
                    async:false,
                    success: function (result) {
                      if (result.status == 200) {
                      	console.log(result)
                      }
                    }
          }) */
    	 // 搜索列表的2px border显示问题
   	    function hide2border(){
   	        if(!($(".humitureHisSearchList>li").length)){
   	        	$(".humitureHisSearchList").hide();
   	        }else{
   	        	$(".humitureHisSearchList").show();
   	        }
   	    }

        //显示历史查询模态框
        var flag=true;

          $("#humitureHisSearchModal").modal('show');
          if(flag){
              var startTime = $(".searchStartData input").val() + " 00:00:00";
              var endTime = $(".searchEndData input").val() + " 23:59:59";
              $.ajax({
                  url: "/alarm/data/history/list?beginTime="+startTime+"&endTime="+endTime+"&deviceTypeId="+devTypeId,
                  type: 'GET',
                  async:false,
                  success: function (result) {
                    if (result.status == 200) {
      					//请求成功去掉loading状态 
      				$(".humitureHisSearchTitle tbody").html('');
      				if(!result.data.length){
      					winTip.alert("暂无数据!");
      				}else{
      					
      					$("#humitureHisSearchModal .resultSum span").text(result.data.length);
      	                  for(var i=0;i<result.data.length;i++){
      	                    var data = result.data[i];
      	                    var alarmStatus;
      	                    if(data.alarmType.alarmCode == '061'){
      	                      alarmStatus = "温湿度报警";
      	                    }else if(data.alarmType.alarmCode == '003'){
      	                      alarmStatus = "温湿度故障";
      	                    }
      	                    var beginTime = moment(data.beginTime).format('YYYY-MM-DD HH:mm:ss')
      	                    var endTime = data.endTime;
      	                    if(endTime){
      	                        endTime = moment(endTime).format('YYYY-MM-DD HH:mm:ss')
      	                    }else{
      	                      endTime = "";
      	                    }
      	                    var disposeStatus = data.disposeStatus?data.disposeStatus:"";
      	                    if(disposeStatus == 1){
      	                    	disposeStatusStr = "已处理";
      	                    }else if(disposeStatus == 2){
      	                    	disposeStatusStr = "未处理";
      	                    }else{
      	                    	disposeStatusStr = "";
      	                    }
      	                    var disposePeople = data.disposePeople?data.disposePeople:"";
      	                      $(".humitureHisSearchTitle tbody").prepend('<tr><td>'+data.device.deviceName+'</td><td>'+data.address+'</td><td>'+alarmStatus+'</td><td>'+beginTime+'</td><td>'+endTime+'</td><td>'+disposeStatusStr+'</td><td>'+disposePeople+'</td><td>'+data.device.devCode+'</td></tr>');
      	                  }
      				}
                    
                    } else {
                  	  winTip.alert(result.message);
                    }
                  }

                }); 
              flag = false;
          }

        
        });
        $(".searchStartData input").val(moment().add('days', -6).format('YYYY-MM-DD'));
        $(".searchEndData input").val(moment().format('YYYY-MM-DD')); 
        $(".humitureHisSearchTitle tbody").css("marginBottom","37px")
        //      根据设备地址选择设备

        var hisSearchCode;
		//点击不是列表的地方隐藏列表
       	$(document).on("click",function () {
    		$(".humitureHisSearchList").hide();
    	});
		//获取焦点时，模糊查询
        $(".humitureHisSearchDev input").on("input", function () {

          if ($(".humitureHisSearchList li")) {
            $(".humitureHisSearchList li").remove();
          }
          //获取搜索内容
          var searchContent = $(".humitureHisSearchDev input").val().trim();
          //if (searchContent) {
            $.ajax({
              url: "/device/data/list/bydeviceTypeandaddresslike/" + devTypeId + "/" + searchContent+"/byuser",
              type: "GET",
              async: false,
              success: function (result) {

                if (result.status == "200") {
                  for (var i = 0; i < result.data.length; i++) {
                    var address = result.data[i].address;
                    var latitude = result.data[i].latitude;
                    var longitude = result.data[i].longitude;
                    var devCode = result.data[i].devCode
                    if (address) {
                      $(".humitureHisSearchList").prepend('<li devicecode="'+devCode+'" longitude="'+longitude+'" latitude="'+latitude+'"><i class="fa fa-map-marker"></i>'+address+'</li>');
                    }
                  }
                } else {
                	winTip.alert(result.message);
                }
              }

            });
            //点击搜索列表将完整地址放入input内
            $(".humitureHisSearchList").on("click", "li", function () {
              var address = $(this).text();
              hisSearchCode = $(this).attr("devicecode");
              var searchAddress = $(".humitureHisSearchDev input").val(address);
              $(".humitureHisSearchList").hide();
              return false;
            });
         // }

          $(".humitureHisSearchList").show();
          hide2border();
        });

		//点击查询按钮
			
		var timeoutflag = null;
        $("#humitureHisSearchBtn").on("click",function (e) {
			//点击查询添加loading
			$(".humitureHisSearchTitle tbody").html('<div class="overlay"><i class="fa fa-refresh fa-spin"></i></div>');
			
            $(this).attr("disabled","true");
            setTimeout(function(){
            	$("#humitureHisSearchBtn").removeAttr("disabled");
            },1000);
          //设置搜索日期
          var searchStartData = $(".searchStartData input").val();
          var searchEndData = $(".searchEndData input").val();
          if(searchStartData&&searchEndData){
          $(".humitureHisSearchList").hide();
          
          var startTime = $(".searchStartData input").val() + " 00:00:00";
          var endTime = $(".searchEndData input").val() + " 23:59:59";
          var devCode = $(".humitureHisSearchDev input").val();
          var alarmType;
          var optionVal = $(".humitureHisAlarmType select").find("option:selected").attr("alarmType");
          var searchContent = $(".humitureHisSearchDev input").val().trim();
           
          var nextUrl;

          hisSearchCode = hisSearchCode?hisSearchCode:"";
			$(".humitureHisSearchDev input").keydown(function(e){
	  			if(e.keyCode == 8){
	  				hisSearchCode="";
	  	            $(".humitureHisSearchList li").remove();
	  			}
	  		 });
          if(optionVal){
              if (optionVal == "061") {
               		alarmType = "061";
               } else if (optionVal == "003") {
               		alarmType = "003";
               } 
              if(hisSearchCode){
            	  nextUrl = "/alarm/data/history/list?beginTime="+startTime+"&endTime="+endTime+"&alarmTypeCode="+alarmType+"&address="+searchContent+"&deviceTypeId="+devTypeId ;
              }else{
            	  nextUrl = "/alarm/data/history/list?beginTime="+startTime+"&endTime="+endTime+"&alarmTypeCode="+alarmType+"&deviceTypeId="+devTypeId;
              }
              
          }else if(searchContent){
            alarmType = "";
            nextUrl = "/alarm/data/history/list?beginTime="+startTime+"&endTime="+endTime+"&address="+searchContent+"&deviceTypeId="+devTypeId ;
          }else if(!searchContent){
        	  nextUrl = "/alarm/data/history/list?beginTime="+startTime+"&endTime="+endTime+"&deviceTypeId="+devTypeId;
          }
			$("#humitureHisSearchModal .resultSum span").text(0);
          $.ajax({
            url: nextUrl,
            type: 'GET',
            async:false,
            //data: $form.serialize(),
            success: function (result) {

              if (result.status == 200) {
					//请求成功去掉loading状态 
				$(".humitureHisSearchTitle tbody").html('');
				if(!result.data.length){
					winTip.alert("暂无数据!");
				}else{
					
					$("#humitureHisSearchModal .resultSum span").text(result.data.length);
	                  for(var i=0;i<result.data.length;i++){
	                    var data = result.data[i];
	                    var alarmStatus;
	                    if(data.alarmType.alarmCode == '061'){
	                      alarmStatus = "温湿度报警";
	                    }else if(data.alarmType.alarmCode == '003'){
	                      alarmStatus = "温湿度故障";
	                    }
	                    var beginTime = moment(data.beginTime).format('YYYY-MM-DD HH:mm:ss')
	                    var endTime = data.endTime;
	                    if(endTime){
	                        endTime = moment(endTime).format('YYYY-MM-DD HH:mm:ss')
	                    }else{
	                      endTime = "";
	                    }
	                    var disposeStatus = data.disposeStatus?data.disposeStatus:"";
	                    if(disposeStatus == 1){
	                    	disposeStatusStr = "已处理";
	                    }else if(disposeStatus == 2){
	                    	disposeStatusStr = "未处理";
	                    }else{
	                    	disposeStatusStr = "";
	                    }
	                    var disposePeople = data.disposePeople?data.disposePeople:"";
	                      $(".humitureHisSearchTitle tbody").prepend('<tr><td>'+data.device.deviceName+'</td><td>'+data.address+'</td><td>'+alarmStatus+'</td><td>'+beginTime+'</td><td>'+endTime+'</td><td>'+disposeStatusStr+'</td><td>'+disposePeople+'</td><td>'+data.device.devCode+'</td></tr>');
	                  }
				}
              
              } else {
            	  winTip.alert(result.message);
              }
            }

          }); 

          
          }
        });
		
      });
      </script>
    </div>
  </div>
</body>

</html>
